<template>
  <div class="resume-list-wrapper">
    <div class="top-box">
      <h2>简历管理</h2>
      <!-- <router-link to="/resume-edit" v-if="btnShow">
        <el-button type="primary" class="fr">创建简历</el-button>
      </router-link> -->
    </div>
    <el-table height="250px" :row-class-name="tableRowClassName" :data="tableData">
      <el-table-column align="center" prop="name" label="姓名">
      </el-table-column>
      <el-table-column align="center" prop="integrity" label="完整度">
        <template slot-scope="scope">
          <span>{{ scope.row.integrity }}%</span>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="downloadCount" label="下载">
      </el-table-column>
      <el-table-column align="center" prop="viewCount" label="浏览量">
      </el-table-column>
      <el-table-column align="center" prop="publicity" label="公开程度">
        <template slot-scope="scope">
          <el-dropdown>
            <span class="el-dropdown-link">
              {{scope.row.publicity == 1 ? '对所有公开' : '完全保密'}}<i class="el-icon-arrow-down el-icon--right"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item @click.native="publicAction(1,scope.row)">对所有公开</el-dropdown-item>
              <el-dropdown-item @click.native="publicAction(2,scope.row)">完全保密</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="express" label="快速投递">
        <template slot-scope="scope">
          <el-switch active-color="#13ce66" @change="expressAction(scope.row)" v-model="scope.row.express">
          </el-switch>
        </template>

      </el-table-column>
      <el-table-column align="center" fixed="right" label="操作" width="120">
        <template slot-scope="scope">
          <el-button type="text" size="small" @click="editResume(scope.row.id)">编辑</el-button>
          <span class="bar">|</span>
          <el-button type="text" size="small" class="delete" @click="deleteAction(scope.row.id)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div class="desc-box">
      <div class="sub-title">公开程度说明</div>
      <div class="mt8">对所有公开:允许招聘人员及所有通过审核的公司查看你的简历(注意:只允许有1份简历可以选择对所有公开)</div>
      <div class="mb16">完全保密:不允许任何人员或公司查看您的简历,个人信息完全保密,除非你主动投递职位。</div>
      <div class="sub-title">快速投递说明</div>
      <div class="mt8">将简历设置为快速投递，申请职位时，直接发送设置快速投递的简历，不再提示选择简历。</div>
    </div>
  </div>
</template>

<script>
import { selectResumeList } from '../../../api/index';
import { updatePublicity, updateExpress, deleteResume } from '../../../api/resumeList.js';

export default {
  name: 'resumeList',
  data () {
    return {
      btnShow: false,
      tableData: []
    };
  },
  created () {
    this.getResumeList()

  },
  methods: {
    tableRowClassName ({ row, rowIndex }) {
      return 'border-none'
    },
    // 获取列表
    getResumeList () {
      selectResumeList().then(res => {
        if (res.success) {
          this.tableData = res.data || [];
          if (this.tableData.length < 3) {
            this.btnShow = true;
          }
        } else {
          this.$message.error(`${res.msg}`);
        }
      });
    },
    //  快速投递
    expressAction (item) {
      let query = {
        id: item.id,
        express: item.express
      }
      updateExpress(query).then(res => {
        if (res.success) {
          this.getResumeList();
          this.$notify({
            type: "success",
            message: "操作成功"
          });
        } else {
          this.$message.error(`${res.msg}`);
        }
      });
    },
    // 删除简历
    deleteAction (id) {

      this.$confirm('此操作将永久删除该简历, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteResume(id).then(res => {
          if (res.success) {
            this.getResumeList();
            this.$notify({
              type: "success",
              message: "删除成功"
            });
          } else {
            this.$message.error(`${res.msg}`);
          }
        });
      }).catch(() => { });
    },
    // 编辑简历
    editResume (id) {
      this.$router.push({
        path: '/resume-edit',
        query: {
          id: id
        }
      })
    },
    // 公开程度
    publicAction (type, item) {
      if (item.publicity == type) {
        return;
      }
      let query = {
        publicity: type,
        id: item.id
      }
      updatePublicity(query).then(res => {
        if (res.success) {
          this.getResumeList();
          this.$notify({
            type: "success",
            message: "操作成功"
          });
        } else {
          this.$message.error(`${res.msg}`);
        }
      });
    }
  }
};
</script>
<style scoped>
.resume-list-wrapper {
    background: #ffffff;
    padding: 24px 44px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
}
.top-box {
    margin-bottom: 25px;
}
h2 {
    font-size: 16px;
    color: #222222;
}
.bar {
    padding: 0px 9px;
}
.fr {
    float: right;
    margin-top: -25px;
    padding: 7px 23px;
}
.desc-box {
    border: 2px solid #f8f8f8;
    padding: 17px 32px;
}
.desc-box {
    font-size: 12px;
    color: #555555;
}
.sub-title {
    color: #222222;
}
.mt8 {
    margin-top: 8px;
}
.mb16 {
    margin-bottom: 16px;
}
.desc-box {
    margin: 50px 0;
}
.desc-box div {
    line-height: 18px;
}
.delete.el-button--text {
    color: #fd4e40;
}
.el-dropdown-link,
.el-button--text {
    font-size: 14px;
    cursor: pointer;
}
</style>